<template>
  <div>
    <w-catalogs @getcatalogid="getcatalogid" :catalogs="catalogs"></w-catalogs>
    <w-articles :articles="articles" @getarticleid="getarticleid"></w-articles>
    <el-row>
      <el-button type="danger" @click="increateCount">危险按钮</el-button>
    </el-row>
    <div>数字{{ count }}</div>
  </div>
</template>

<script>
import wCatalogs from "@/components/w-catalogs.vue";
import wArticles from "@/components/w-articles.vue";
import { mapState ,mapMutations} from "vuex";
export default {
  data() {
    return {
      catalogs: [],
      articles: [],
    };
  },
  components: {
    wCatalogs,
    wArticles,
  },
  computed: {
    ...mapState(["count"]),
  },
  created() {
    this.getCatalogs();
  },
  methods: {
	  ...mapMutations(['increate']),
    /**
     * 获取所有文章分类
     */
    getCatalogs() {
      this.$axios
        .get("api/articlecate/getmobilearticlecates")
        .then((res) => {
          //console.log(res.data.rows);
          this.catalogs = res.data.rows;
        })
        .catch((err) => {});
    },

    //获取文章分类编号
    getcatalogid(id) {
      this.$axios
        .get("api/articles/catid", {
          params: {
            cat_id: id,
          },
        })
        .then((res) => {
          this.articles = res.data.data;
        })
        .catch((err) => {});
    },
    getarticleid(id) {
      console.log(id);
      //$route
      //$router
      this.$router.push({ path: "/article", query: { id: id } });
    },
	increateCount(){
		this.increate(1);
		
	}
  },
};
</script>

<style>
</style>
